<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=2364748" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b9;</span>
                <div class="name">gongaao</div>
                <div class="code-name">&amp;#xe7b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7ba;</span>
                <div class="name">huodong</div>
                <div class="code-name">&amp;#xe7ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bb;</span>
                <div class="name">tixian</div>
                <div class="code-name">&amp;#xe7bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bc;</span>
                <div class="name">guize</div>
                <div class="code-name">&amp;#xe7bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bd;</span>
                <div class="name">liucheng</div>
                <div class="code-name">&amp;#xe7bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7be;</span>
                <div class="name">ziliao</div>
                <div class="code-name">&amp;#xe7be;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7bf;</span>
                <div class="name">hezuo</div>
                <div class="code-name">&amp;#xe7bf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe682;</span>
                <div class="name">user</div>
                <div class="code-name">&amp;#xe682;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b1;</span>
                <div class="name">jiesuan</div>
                <div class="code-name">&amp;#xe7b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b2;</span>
                <div class="name">zhangdan</div>
                <div class="code-name">&amp;#xe7b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b3;</span>
                <div class="name">jiesuan</div>
                <div class="code-name">&amp;#xe7b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b4;</span>
                <div class="name">jiangbei</div>
                <div class="code-name">&amp;#xe7b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b5;</span>
                <div class="name">zhangdan</div>
                <div class="code-name">&amp;#xe7b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b6;</span>
                <div class="name">home</div>
                <div class="code-name">&amp;#xe7b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b7;</span>
                <div class="name">caidan</div>
                <div class="code-name">&amp;#xe7b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe644;</span>
                <div class="name">确认密码</div>
                <div class="code-name">&amp;#xe644;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66f;</span>
                <div class="name">链接</div>
                <div class="code-name">&amp;#xe66f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe63c;</span>
                <div class="name">验证码</div>
                <div class="code-name">&amp;#xe63c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">用户名</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">88密码</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe72a;</span>
                <div class="name">提现</div>
                <div class="code-name">&amp;#xe72a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66e;</span>
                <div class="name">充值</div>
                <div class="code-name">&amp;#xe66e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ea;</span>
                <div class="name">全部</div>
                <div class="code-name">&amp;#xe8ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61c;</span>
                <div class="name">002-nav-资讯</div>
                <div class="code-name">&amp;#xe61c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b7;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">箭头</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe722;</span>
                <div class="name">奖牌</div>
                <div class="code-name">&amp;#xe722;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ba;</span>
                <div class="name">提现充值</div>
                <div class="code-name">&amp;#xe6ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8c2;</span>
                <div class="name">新用户注册</div>
                <div class="code-name">&amp;#xe8c2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe616;</span>
                <div class="name">趋势</div>
                <div class="code-name">&amp;#xe616;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">足球（场馆）</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe634;</span>
                <div class="name">苹果</div>
                <div class="code-name">&amp;#xe634;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">安卓</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe658;</span>
                <div class="name">round_close_fill</div>
                <div class="code-name">&amp;#xe658;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe614;</span>
                <div class="name">首页</div>
                <div class="code-name">&amp;#xe614;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe657;</span>
                <div class="name">活动</div>
                <div class="code-name">&amp;#xe657;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e9;</span>
                <div class="name">个人中心</div>
                <div class="code-name">&amp;#xe8e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">资讯</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">赛事列表</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6cf;</span>
                <div class="name">规则说明</div>
                <div class="code-name">&amp;#xe6cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">公告中心</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7e8;</span>
                <div class="name">交易数据</div>
                <div class="code-name">&amp;#xe7e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6c4;</span>
                <div class="name">合作</div>
                <div class="code-name">&amp;#xe6c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe613;</span>
                <div class="name">Add</div>
                <div class="code-name">&amp;#xe613;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe611;</span>
                <div class="name">客服</div>
                <div class="code-name">&amp;#xe611;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73e;</span>
                <div class="name">menu</div>
                <div class="code-name">&amp;#xe73e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe662;</span>
                <div class="name">消息通知</div>
                <div class="code-name">&amp;#xe662;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">whatsapp</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe610;</span>
                <div class="name">email</div>
                <div class="code-name">&amp;#xe610;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ea;</span>
                <div class="name">bxl-telegram</div>
                <div class="code-name">&amp;#xe6ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62d;</span>
                <div class="name">设置</div>
                <div class="code-name">&amp;#xe62d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66a;</span>
                <div class="name">收货地址</div>
                <div class="code-name">&amp;#xe66a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">排序</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe643;</span>
                <div class="name">下载</div>
                <div class="code-name">&amp;#xe643;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6db;</span>
                <div class="name">复制</div>
                <div class="code-name">&amp;#xe6db;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">ic_hot</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe609;</span>
                <div class="name">设 置</div>
                <div class="code-name">&amp;#xe609;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe608;</span>
                <div class="name">双箭头</div>
                <div class="code-name">&amp;#xe608;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe745;</span>
                <div class="name">双箭头</div>
                <div class="code-name">&amp;#xe745;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">经纪人</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68a;</span>
                <div class="name">客户经理</div>
                <div class="code-name">&amp;#xe68a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">三 点</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe641;</span>
                <div class="name">app下载</div>
                <div class="code-name">&amp;#xe641;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">kefu</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7c4;</span>
                <div class="name">bell</div>
                <div class="code-name">&amp;#xe7c4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">down</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60a;</span>
                <div class="name">menu</div>
                <div class="code-name">&amp;#xe60a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">服务流程2</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">国籍</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">法官</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">材料回填</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">审判辅助</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">档案，书籍</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75d;</span>
                <div class="name">海事</div>
                <div class="code-name">&amp;#xe75d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">平台</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">司法鉴定02</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe622;</span>
                <div class="name">材料</div>
                <div class="code-name">&amp;#xe622;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7f8;</span>
                <div class="name">信访投诉</div>
                <div class="code-name">&amp;#xe7f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe656;</span>
                <div class="name">卷宗1</div>
                <div class="code-name">&amp;#xe656;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e3;</span>
                <div class="name">转发 发送-3</div>
                <div class="code-name">&amp;#xe6e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe601;</span>
                <div class="name">热点</div>
                <div class="code-name">&amp;#xe601;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6eb;</span>
                <div class="name">字号</div>
                <div class="code-name">&amp;#xe6eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75a;</span>
                <div class="name">地址</div>
                <div class="code-name">&amp;#xe75a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe859;</span>
                <div class="name">收 藏 (2)</div>
                <div class="code-name">&amp;#xe859;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe645;</span>
                <div class="name">时 间</div>
                <div class="code-name">&amp;#xe645;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">公告</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe600;</span>
                <div class="name">打印</div>
                <div class="code-name">&amp;#xe600;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f5;</span>
                <div class="name">文件</div>
                <div class="code-name">&amp;#xe6f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60b;</span>
                <div class="name">链接</div>
                <div class="code-name">&amp;#xe60b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe603;</span>
                <div class="name">收 藏</div>
                <div class="code-name">&amp;#xe603;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6e8;</span>
                <div class="name">通知</div>
                <div class="code-name">&amp;#xe6e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe602;</span>
                <div class="name">搜索</div>
                <div class="code-name">&amp;#xe602;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">jian</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">问好</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">add</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">筛选</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64b;</span>
                <div class="name">筛选</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ab;</span>
                <div class="name">辅助_协助</div>
                <div class="code-name">&amp;#xe6ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe646;</span>
                <div class="name">播放中</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe702;</span>
                <div class="name">分 享</div>
                <div class="code-name">&amp;#xe702;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe635;</span>
                <div class="name">刷新</div>
                <div class="code-name">&amp;#xe635;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">ren-qunyou</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe700;</span>
                <div class="name">地址</div>
                <div class="code-name">&amp;#xe700;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75c;</span>
                <div class="name">QQ</div>
                <div class="code-name">&amp;#xe75c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">微信 (1)</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe7b8;</span>
                <div class="name">transaction-order</div>
                <div class="code-name">&amp;#xe7b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">close</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">购物车</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">客服</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe642;</span>
                <div class="name">收 藏 (1)</div>
                <div class="code-name">&amp;#xe642;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">收 藏</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">分 享</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60c;</span>
                <div class="name">决策树筛选</div>
                <div class="code-name">&amp;#xe60c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe71c;</span>
                <div class="name">筛 选</div>
                <div class="code-name">&amp;#xe71c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">down</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">eye</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b6;</span>
                <div class="name">定位</div>
                <div class="code-name">&amp;#xe6b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe84d;</span>
                <div class="name">map</div>
                <div class="code-name">&amp;#xe84d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">eye</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6aa;</span>
                <div class="name">map</div>
                <div class="code-name">&amp;#xe6aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6f4;</span>
                <div class="name">搜索</div>
                <div class="code-name">&amp;#xe6f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe667;</span>
                <div class="name">up</div>
                <div class="code-name">&amp;#xe667;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe66d;</span>
                <div class="name">left</div>
                <div class="code-name">&amp;#xe66d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe826;</span>
                <div class="name">left</div>
                <div class="code-name">&amp;#xe826;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe827;</span>
                <div class="name">up</div>
                <div class="code-name">&amp;#xe827;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69f;</span>
                <div class="name">dui-5</div>
                <div class="code-name">&amp;#xe69f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe647;</span>
                <div class="name">警告</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.eot?t=1634271163696'); /* IE9 */
  src: url('iconfont.eot?t=1634271163696#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
       url('iconfont.woff?t=1634271163696') format('woff'),
       url('iconfont.ttf?t=1634271163696') format('truetype'),
       url('iconfont.svg?t=1634271163696#iconfont') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-gongaao"></span>
            <div class="name">
              gongaao
            </div>
            <div class="code-name">.icon-gongaao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huodong1"></span>
            <div class="name">
              huodong
            </div>
            <div class="code-name">.icon-huodong1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tixian1"></span>
            <div class="name">
              tixian
            </div>
            <div class="code-name">.icon-tixian1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guize"></span>
            <div class="name">
              guize
            </div>
            <div class="code-name">.icon-guize
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liucheng"></span>
            <div class="name">
              liucheng
            </div>
            <div class="code-name">.icon-liucheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziliao"></span>
            <div class="name">
              ziliao
            </div>
            <div class="code-name">.icon-ziliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-hezuo1"></span>
            <div class="name">
              hezuo
            </div>
            <div class="code-name">.icon-hezuo1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-user"></span>
            <div class="name">
              user
            </div>
            <div class="code-name">.icon-user
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiesuan"></span>
            <div class="name">
              jiesuan
            </div>
            <div class="code-name">.icon-jiesuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhangdan"></span>
            <div class="name">
              zhangdan
            </div>
            <div class="code-name">.icon-zhangdan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiesuan1"></span>
            <div class="name">
              jiesuan
            </div>
            <div class="code-name">.icon-jiesuan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei"></span>
            <div class="name">
              jiangbei
            </div>
            <div class="code-name">.icon-jiangbei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhangdan1"></span>
            <div class="name">
              zhangdan
            </div>
            <div class="code-name">.icon-zhangdan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-home"></span>
            <div class="name">
              home
            </div>
            <div class="code-name">.icon-home
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-caidan"></span>
            <div class="name">
              caidan
            </div>
            <div class="code-name">.icon-caidan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-querenmima"></span>
            <div class="name">
              确认密码
            </div>
            <div class="code-name">.icon-querenmima
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tlink"></span>
            <div class="name">
              链接
            </div>
            <div class="code-name">.icon-tlink
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yanzhengma"></span>
            <div class="name">
              验证码
            </div>
            <div class="code-name">.icon-yanzhengma
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yonghuming"></span>
            <div class="name">
              用户名
            </div>
            <div class="code-name">.icon-yonghuming
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-_mima2"></span>
            <div class="name">
              88密码
            </div>
            <div class="code-name">.icon-_mima2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tixian"></span>
            <div class="name">
              提现
            </div>
            <div class="code-name">.icon-tixian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chongzhi"></span>
            <div class="name">
              充值
            </div>
            <div class="code-name">.icon-chongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-quanbu"></span>
            <div class="name">
              全部
            </div>
            <div class="code-name">.icon-quanbu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon--nav-zixun"></span>
            <div class="name">
              002-nav-资讯
            </div>
            <div class="code-name">.icon--nav-zixun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhi2"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-shezhi2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-arr_rt"></span>
            <div class="name">
              箭头
            </div>
            <div class="code-name">.icon-arr_rt
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangpai"></span>
            <div class="name">
              奖牌
            </div>
            <div class="code-name">.icon-jiangpai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tixianchongzhi"></span>
            <div class="name">
              提现充值
            </div>
            <div class="code-name">.icon-tixianchongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xinyonghuzhuce"></span>
            <div class="name">
              新用户注册
            </div>
            <div class="code-name">.icon-xinyonghuzhuce
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qushi"></span>
            <div class="name">
              趋势
            </div>
            <div class="code-name">.icon-qushi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-zuqiuchangguan"></span>
            <div class="name">
              足球（场馆）
            </div>
            <div class="code-name">.icon-a-zuqiuchangguan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontapple"></span>
            <div class="name">
              苹果
            </div>
            <div class="code-name">.icon-iconfontapple
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-anzhuo"></span>
            <div class="name">
              安卓
            </div>
            <div class="code-name">.icon-anzhuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-closefill"></span>
            <div class="name">
              round_close_fill
            </div>
            <div class="code-name">.icon-closefill
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouye"></span>
            <div class="name">
              首页
            </div>
            <div class="code-name">.icon-shouye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huodong"></span>
            <div class="name">
              活动
            </div>
            <div class="code-name">.icon-huodong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gerenzhongxin"></span>
            <div class="name">
              个人中心
            </div>
            <div class="code-name">.icon-gerenzhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zixun"></span>
            <div class="name">
              资讯
            </div>
            <div class="code-name">.icon-zixun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-saishiliebiao"></span>
            <div class="name">
              赛事列表
            </div>
            <div class="code-name">.icon-saishiliebiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guizeshuoming"></span>
            <div class="name">
              规则说明
            </div>
            <div class="code-name">.icon-guizeshuoming
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gonggaozhongxin"></span>
            <div class="name">
              公告中心
            </div>
            <div class="code-name">.icon-gonggaozhongxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiaoyishuju"></span>
            <div class="name">
              交易数据
            </div>
            <div class="code-name">.icon-jiaoyishuju
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-hezuo"></span>
            <div class="name">
              合作
            </div>
            <div class="code-name">.icon-hezuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Add"></span>
            <div class="name">
              Add
            </div>
            <div class="code-name">.icon-Add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kf"></span>
            <div class="name">
              客服
            </div>
            <div class="code-name">.icon-kf
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menut"></span>
            <div class="name">
              menu
            </div>
            <div class="code-name">.icon-menut
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaoxitongzhi"></span>
            <div class="name">
              消息通知
            </div>
            <div class="code-name">.icon-xiaoxitongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-whatsapp"></span>
            <div class="name">
              whatsapp
            </div>
            <div class="code-name">.icon-whatsapp
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-email"></span>
            <div class="name">
              email
            </div>
            <div class="code-name">.icon-email
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bxl-telegram"></span>
            <div class="name">
              bxl-telegram
            </div>
            <div class="code-name">.icon-bxl-telegram
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhi1"></span>
            <div class="name">
              设置
            </div>
            <div class="code-name">.icon-shezhi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouhuodizhi"></span>
            <div class="name">
              收货地址
            </div>
            <div class="code-name">.icon-shouhuodizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-paixu"></span>
            <div class="name">
              排序
            </div>
            <div class="code-name">.icon-paixu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiazai"></span>
            <div class="name">
              下载
            </div>
            <div class="code-name">.icon-xiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fuzhi"></span>
            <div class="name">
              复制
            </div>
            <div class="code-name">.icon-fuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ic_hot"></span>
            <div class="name">
              ic_hot
            </div>
            <div class="code-name">.icon-ic_hot
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shezhi"></span>
            <div class="name">
              设 置
            </div>
            <div class="code-name">.icon-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-double-arrow-left"></span>
            <div class="name">
              双箭头
            </div>
            <div class="code-name">.icon-double-arrow-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-double-arrow-right"></span>
            <div class="name">
              双箭头
            </div>
            <div class="code-name">.icon-double-arrow-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jingjiren3"></span>
            <div class="name">
              经纪人
            </div>
            <div class="code-name">.icon-jingjiren3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kehujingli"></span>
            <div class="name">
              客户经理
            </div>
            <div class="code-name">.icon-kehujingli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sandian"></span>
            <div class="name">
              三 点
            </div>
            <div class="code-name">.icon-sandian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-appxiazai"></span>
            <div class="name">
              app下载
            </div>
            <div class="code-name">.icon-appxiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-iconfontkefu"></span>
            <div class="name">
              kefu
            </div>
            <div class="code-name">.icon-iconfontkefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bell"></span>
            <div class="name">
              bell
            </div>
            <div class="code-name">.icon-bell
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-down2"></span>
            <div class="name">
              down
            </div>
            <div class="code-name">.icon-down2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-menu"></span>
            <div class="name">
              menu
            </div>
            <div class="code-name">.icon-menu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sx"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.icon-sx
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fuwuliucheng"></span>
            <div class="name">
              服务流程2
            </div>
            <div class="code-name">.icon-fuwuliucheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guoji"></span>
            <div class="name">
              国籍
            </div>
            <div class="code-name">.icon-guoji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-judge"></span>
            <div class="name">
              法官
            </div>
            <div class="code-name">.icon-judge
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-cailiaohuitian"></span>
            <div class="name">
              材料回填
            </div>
            <div class="code-name">.icon-cailiaohuitian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenpanfuzhu"></span>
            <div class="name">
              审判辅助
            </div>
            <div class="code-name">.icon-shenpanfuzhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-danganshuji"></span>
            <div class="name">
              档案，书籍
            </div>
            <div class="code-name">.icon-danganshuji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-haishi"></span>
            <div class="name">
              海事
            </div>
            <div class="code-name">.icon-haishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pingtai"></span>
            <div class="name">
              平台
            </div>
            <div class="code-name">.icon-pingtai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sifajianding02"></span>
            <div class="name">
              司法鉴定02
            </div>
            <div class="code-name">.icon-sifajianding02
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-cailiao"></span>
            <div class="name">
              材料
            </div>
            <div class="code-name">.icon-cailiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xinfangtousu"></span>
            <div class="name">
              信访投诉
            </div>
            <div class="code-name">.icon-xinfangtousu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-juanzong1"></span>
            <div class="name">
              卷宗1
            </div>
            <div class="code-name">.icon-juanzong1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zhuanfafasong-"></span>
            <div class="name">
              转发 发送-3
            </div>
            <div class="code-name">.icon-zhuanfafasong-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-redian"></span>
            <div class="name">
              热点
            </div>
            <div class="code-name">.icon-redian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-zihao"></span>
            <div class="name">
              字号
            </div>
            <div class="code-name">.icon-zihao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dz"></span>
            <div class="name">
              地址
            </div>
            <div class="code-name">.icon-dz
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang2"></span>
            <div class="name">
              收 藏 (2)
            </div>
            <div class="code-name">.icon-shoucang2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shijian"></span>
            <div class="name">
              时 间
            </div>
            <div class="code-name">.icon-shijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gonggao"></span>
            <div class="name">
              公告
            </div>
            <div class="code-name">.icon-gonggao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dayin"></span>
            <div class="name">
              打印
            </div>
            <div class="code-name">.icon-dayin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wenjian"></span>
            <div class="name">
              文件
            </div>
            <div class="code-name">.icon-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-lianjie"></span>
            <div class="name">
              链接
            </div>
            <div class="code-name">.icon-lianjie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang3"></span>
            <div class="name">
              收 藏
            </div>
            <div class="code-name">.icon-shoucang3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tongzhi"></span>
            <div class="name">
              通知
            </div>
            <div class="code-name">.icon-tongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sousuo"></span>
            <div class="name">
              搜索
            </div>
            <div class="code-name">.icon-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jian"></span>
            <div class="name">
              jian
            </div>
            <div class="code-name">.icon-jian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wenhao"></span>
            <div class="name">
              问好
            </div>
            <div class="code-name">.icon-wenhao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-add"></span>
            <div class="name">
              add
            </div>
            <div class="code-name">.icon-add
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shaixuan"></span>
            <div class="name">
              筛选
            </div>
            <div class="code-name">.icon-shaixuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shaixuan1"></span>
            <div class="name">
              筛选
            </div>
            <div class="code-name">.icon-shaixuan1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fuzhu_xiezhu"></span>
            <div class="name">
              辅助_协助
            </div>
            <div class="code-name">.icon-fuzhu_xiezhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bofangzhong"></span>
            <div class="name">
              播放中
            </div>
            <div class="code-name">.icon-bofangzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fenxiang1"></span>
            <div class="name">
              分 享
            </div>
            <div class="code-name">.icon-fenxiang1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuaxin"></span>
            <div class="name">
              刷新
            </div>
            <div class="code-name">.icon-shuaxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ren-qunyou"></span>
            <div class="name">
              ren-qunyou
            </div>
            <div class="code-name">.icon-ren-qunyou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dizhi"></span>
            <div class="name">
              地址
            </div>
            <div class="code-name">.icon-dizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-QQ"></span>
            <div class="name">
              QQ
            </div>
            <div class="code-name">.icon-QQ
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-weixin"></span>
            <div class="name">
              微信 (1)
            </div>
            <div class="code-name">.icon-weixin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-transaction-order"></span>
            <div class="name">
              transaction-order
            </div>
            <div class="code-name">.icon-transaction-order
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-close"></span>
            <div class="name">
              close
            </div>
            <div class="code-name">.icon-close
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gouwuche"></span>
            <div class="name">
              购物车
            </div>
            <div class="code-name">.icon-gouwuche
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kefu"></span>
            <div class="name">
              客服
            </div>
            <div class="code-name">.icon-kefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang"></span>
            <div class="name">
              收 藏 (1)
            </div>
            <div class="code-name">.icon-shoucang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoucang1"></span>
            <div class="name">
              收 藏
            </div>
            <div class="code-name">.icon-shoucang1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fenxiang"></span>
            <div class="name">
              分 享
            </div>
            <div class="code-name">.icon-fenxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sx2"></span>
            <div class="name">
              决策树筛选
            </div>
            <div class="code-name">.icon-sx2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sx1"></span>
            <div class="name">
              筛 选
            </div>
            <div class="code-name">.icon-sx1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-sj-down"></span>
            <div class="name">
              down
            </div>
            <div class="code-name">.icon-sj-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-eye1"></span>
            <div class="name">
              eye
            </div>
            <div class="code-name">.icon-eye1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dingwei"></span>
            <div class="name">
              定位
            </div>
            <div class="code-name">.icon-dingwei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-map"></span>
            <div class="name">
              map
            </div>
            <div class="code-name">.icon-map
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-eye"></span>
            <div class="name">
              eye
            </div>
            <div class="code-name">.icon-eye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-map1"></span>
            <div class="name">
              map
            </div>
            <div class="code-name">.icon-map1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-Icon"></span>
            <div class="name">
              搜索
            </div>
            <div class="code-name">.icon-Icon
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-up"></span>
            <div class="name">
              up
            </div>
            <div class="code-name">.icon-up
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-left"></span>
            <div class="name">
              left
            </div>
            <div class="code-name">.icon-left
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-right"></span>
            <div class="name">
              left
            </div>
            <div class="code-name">.icon-right
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-down"></span>
            <div class="name">
              up
            </div>
            <div class="code-name">.icon-down
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dui"></span>
            <div class="name">
              dui-5
            </div>
            <div class="code-name">.icon-dui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jinggao"></span>
            <div class="name">
              警告
            </div>
            <div class="code-name">.icon-jinggao
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gongaao"></use>
                </svg>
                <div class="name">gongaao</div>
                <div class="code-name">#icon-gongaao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huodong1"></use>
                </svg>
                <div class="name">huodong</div>
                <div class="code-name">#icon-huodong1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tixian1"></use>
                </svg>
                <div class="name">tixian</div>
                <div class="code-name">#icon-tixian1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guize"></use>
                </svg>
                <div class="name">guize</div>
                <div class="code-name">#icon-guize</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liucheng"></use>
                </svg>
                <div class="name">liucheng</div>
                <div class="code-name">#icon-liucheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziliao"></use>
                </svg>
                <div class="name">ziliao</div>
                <div class="code-name">#icon-ziliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-hezuo1"></use>
                </svg>
                <div class="name">hezuo</div>
                <div class="code-name">#icon-hezuo1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-user"></use>
                </svg>
                <div class="name">user</div>
                <div class="code-name">#icon-user</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiesuan"></use>
                </svg>
                <div class="name">jiesuan</div>
                <div class="code-name">#icon-jiesuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhangdan"></use>
                </svg>
                <div class="name">zhangdan</div>
                <div class="code-name">#icon-zhangdan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiesuan1"></use>
                </svg>
                <div class="name">jiesuan</div>
                <div class="code-name">#icon-jiesuan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei"></use>
                </svg>
                <div class="name">jiangbei</div>
                <div class="code-name">#icon-jiangbei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhangdan1"></use>
                </svg>
                <div class="name">zhangdan</div>
                <div class="code-name">#icon-zhangdan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-home"></use>
                </svg>
                <div class="name">home</div>
                <div class="code-name">#icon-home</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-caidan"></use>
                </svg>
                <div class="name">caidan</div>
                <div class="code-name">#icon-caidan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-querenmima"></use>
                </svg>
                <div class="name">确认密码</div>
                <div class="code-name">#icon-querenmima</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tlink"></use>
                </svg>
                <div class="name">链接</div>
                <div class="code-name">#icon-tlink</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yanzhengma"></use>
                </svg>
                <div class="name">验证码</div>
                <div class="code-name">#icon-yanzhengma</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yonghuming"></use>
                </svg>
                <div class="name">用户名</div>
                <div class="code-name">#icon-yonghuming</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-_mima2"></use>
                </svg>
                <div class="name">88密码</div>
                <div class="code-name">#icon-_mima2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tixian"></use>
                </svg>
                <div class="name">提现</div>
                <div class="code-name">#icon-tixian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chongzhi"></use>
                </svg>
                <div class="name">充值</div>
                <div class="code-name">#icon-chongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-quanbu"></use>
                </svg>
                <div class="name">全部</div>
                <div class="code-name">#icon-quanbu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon--nav-zixun"></use>
                </svg>
                <div class="name">002-nav-资讯</div>
                <div class="code-name">#icon--nav-zixun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhi2"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-shezhi2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-arr_rt"></use>
                </svg>
                <div class="name">箭头</div>
                <div class="code-name">#icon-arr_rt</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangpai"></use>
                </svg>
                <div class="name">奖牌</div>
                <div class="code-name">#icon-jiangpai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tixianchongzhi"></use>
                </svg>
                <div class="name">提现充值</div>
                <div class="code-name">#icon-tixianchongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xinyonghuzhuce"></use>
                </svg>
                <div class="name">新用户注册</div>
                <div class="code-name">#icon-xinyonghuzhuce</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qushi"></use>
                </svg>
                <div class="name">趋势</div>
                <div class="code-name">#icon-qushi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-zuqiuchangguan"></use>
                </svg>
                <div class="name">足球（场馆）</div>
                <div class="code-name">#icon-a-zuqiuchangguan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontapple"></use>
                </svg>
                <div class="name">苹果</div>
                <div class="code-name">#icon-iconfontapple</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-anzhuo"></use>
                </svg>
                <div class="name">安卓</div>
                <div class="code-name">#icon-anzhuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-closefill"></use>
                </svg>
                <div class="name">round_close_fill</div>
                <div class="code-name">#icon-closefill</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouye"></use>
                </svg>
                <div class="name">首页</div>
                <div class="code-name">#icon-shouye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huodong"></use>
                </svg>
                <div class="name">活动</div>
                <div class="code-name">#icon-huodong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gerenzhongxin"></use>
                </svg>
                <div class="name">个人中心</div>
                <div class="code-name">#icon-gerenzhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zixun"></use>
                </svg>
                <div class="name">资讯</div>
                <div class="code-name">#icon-zixun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-saishiliebiao"></use>
                </svg>
                <div class="name">赛事列表</div>
                <div class="code-name">#icon-saishiliebiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guizeshuoming"></use>
                </svg>
                <div class="name">规则说明</div>
                <div class="code-name">#icon-guizeshuoming</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gonggaozhongxin"></use>
                </svg>
                <div class="name">公告中心</div>
                <div class="code-name">#icon-gonggaozhongxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiaoyishuju"></use>
                </svg>
                <div class="name">交易数据</div>
                <div class="code-name">#icon-jiaoyishuju</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-hezuo"></use>
                </svg>
                <div class="name">合作</div>
                <div class="code-name">#icon-hezuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Add"></use>
                </svg>
                <div class="name">Add</div>
                <div class="code-name">#icon-Add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kf"></use>
                </svg>
                <div class="name">客服</div>
                <div class="code-name">#icon-kf</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menut"></use>
                </svg>
                <div class="name">menu</div>
                <div class="code-name">#icon-menut</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaoxitongzhi"></use>
                </svg>
                <div class="name">消息通知</div>
                <div class="code-name">#icon-xiaoxitongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-whatsapp"></use>
                </svg>
                <div class="name">whatsapp</div>
                <div class="code-name">#icon-whatsapp</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-email"></use>
                </svg>
                <div class="name">email</div>
                <div class="code-name">#icon-email</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bxl-telegram"></use>
                </svg>
                <div class="name">bxl-telegram</div>
                <div class="code-name">#icon-bxl-telegram</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhi1"></use>
                </svg>
                <div class="name">设置</div>
                <div class="code-name">#icon-shezhi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouhuodizhi"></use>
                </svg>
                <div class="name">收货地址</div>
                <div class="code-name">#icon-shouhuodizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-paixu"></use>
                </svg>
                <div class="name">排序</div>
                <div class="code-name">#icon-paixu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiazai"></use>
                </svg>
                <div class="name">下载</div>
                <div class="code-name">#icon-xiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fuzhi"></use>
                </svg>
                <div class="name">复制</div>
                <div class="code-name">#icon-fuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ic_hot"></use>
                </svg>
                <div class="name">ic_hot</div>
                <div class="code-name">#icon-ic_hot</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shezhi"></use>
                </svg>
                <div class="name">设 置</div>
                <div class="code-name">#icon-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-double-arrow-left"></use>
                </svg>
                <div class="name">双箭头</div>
                <div class="code-name">#icon-double-arrow-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-double-arrow-right"></use>
                </svg>
                <div class="name">双箭头</div>
                <div class="code-name">#icon-double-arrow-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jingjiren3"></use>
                </svg>
                <div class="name">经纪人</div>
                <div class="code-name">#icon-jingjiren3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kehujingli"></use>
                </svg>
                <div class="name">客户经理</div>
                <div class="code-name">#icon-kehujingli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sandian"></use>
                </svg>
                <div class="name">三 点</div>
                <div class="code-name">#icon-sandian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-appxiazai"></use>
                </svg>
                <div class="name">app下载</div>
                <div class="code-name">#icon-appxiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-iconfontkefu"></use>
                </svg>
                <div class="name">kefu</div>
                <div class="code-name">#icon-iconfontkefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bell"></use>
                </svg>
                <div class="name">bell</div>
                <div class="code-name">#icon-bell</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down2"></use>
                </svg>
                <div class="name">down</div>
                <div class="code-name">#icon-down2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-menu"></use>
                </svg>
                <div class="name">menu</div>
                <div class="code-name">#icon-menu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sx"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#icon-sx</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fuwuliucheng"></use>
                </svg>
                <div class="name">服务流程2</div>
                <div class="code-name">#icon-fuwuliucheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guoji"></use>
                </svg>
                <div class="name">国籍</div>
                <div class="code-name">#icon-guoji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-judge"></use>
                </svg>
                <div class="name">法官</div>
                <div class="code-name">#icon-judge</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cailiaohuitian"></use>
                </svg>
                <div class="name">材料回填</div>
                <div class="code-name">#icon-cailiaohuitian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenpanfuzhu"></use>
                </svg>
                <div class="name">审判辅助</div>
                <div class="code-name">#icon-shenpanfuzhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-danganshuji"></use>
                </svg>
                <div class="name">档案，书籍</div>
                <div class="code-name">#icon-danganshuji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-haishi"></use>
                </svg>
                <div class="name">海事</div>
                <div class="code-name">#icon-haishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pingtai"></use>
                </svg>
                <div class="name">平台</div>
                <div class="code-name">#icon-pingtai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sifajianding02"></use>
                </svg>
                <div class="name">司法鉴定02</div>
                <div class="code-name">#icon-sifajianding02</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-cailiao"></use>
                </svg>
                <div class="name">材料</div>
                <div class="code-name">#icon-cailiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xinfangtousu"></use>
                </svg>
                <div class="name">信访投诉</div>
                <div class="code-name">#icon-xinfangtousu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-juanzong1"></use>
                </svg>
                <div class="name">卷宗1</div>
                <div class="code-name">#icon-juanzong1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zhuanfafasong-"></use>
                </svg>
                <div class="name">转发 发送-3</div>
                <div class="code-name">#icon-zhuanfafasong-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-redian"></use>
                </svg>
                <div class="name">热点</div>
                <div class="code-name">#icon-redian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-zihao"></use>
                </svg>
                <div class="name">字号</div>
                <div class="code-name">#icon-zihao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dz"></use>
                </svg>
                <div class="name">地址</div>
                <div class="code-name">#icon-dz</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang2"></use>
                </svg>
                <div class="name">收 藏 (2)</div>
                <div class="code-name">#icon-shoucang2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shijian"></use>
                </svg>
                <div class="name">时 间</div>
                <div class="code-name">#icon-shijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gonggao"></use>
                </svg>
                <div class="name">公告</div>
                <div class="code-name">#icon-gonggao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dayin"></use>
                </svg>
                <div class="name">打印</div>
                <div class="code-name">#icon-dayin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wenjian"></use>
                </svg>
                <div class="name">文件</div>
                <div class="code-name">#icon-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lianjie"></use>
                </svg>
                <div class="name">链接</div>
                <div class="code-name">#icon-lianjie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang3"></use>
                </svg>
                <div class="name">收 藏</div>
                <div class="code-name">#icon-shoucang3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tongzhi"></use>
                </svg>
                <div class="name">通知</div>
                <div class="code-name">#icon-tongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sousuo"></use>
                </svg>
                <div class="name">搜索</div>
                <div class="code-name">#icon-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jian"></use>
                </svg>
                <div class="name">jian</div>
                <div class="code-name">#icon-jian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wenhao"></use>
                </svg>
                <div class="name">问好</div>
                <div class="code-name">#icon-wenhao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-add"></use>
                </svg>
                <div class="name">add</div>
                <div class="code-name">#icon-add</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shaixuan"></use>
                </svg>
                <div class="name">筛选</div>
                <div class="code-name">#icon-shaixuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shaixuan1"></use>
                </svg>
                <div class="name">筛选</div>
                <div class="code-name">#icon-shaixuan1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fuzhu_xiezhu"></use>
                </svg>
                <div class="name">辅助_协助</div>
                <div class="code-name">#icon-fuzhu_xiezhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bofangzhong"></use>
                </svg>
                <div class="name">播放中</div>
                <div class="code-name">#icon-bofangzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenxiang1"></use>
                </svg>
                <div class="name">分 享</div>
                <div class="code-name">#icon-fenxiang1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuaxin"></use>
                </svg>
                <div class="name">刷新</div>
                <div class="code-name">#icon-shuaxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ren-qunyou"></use>
                </svg>
                <div class="name">ren-qunyou</div>
                <div class="code-name">#icon-ren-qunyou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dizhi"></use>
                </svg>
                <div class="name">地址</div>
                <div class="code-name">#icon-dizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-QQ"></use>
                </svg>
                <div class="name">QQ</div>
                <div class="code-name">#icon-QQ</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-weixin"></use>
                </svg>
                <div class="name">微信 (1)</div>
                <div class="code-name">#icon-weixin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-transaction-order"></use>
                </svg>
                <div class="name">transaction-order</div>
                <div class="code-name">#icon-transaction-order</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-close"></use>
                </svg>
                <div class="name">close</div>
                <div class="code-name">#icon-close</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gouwuche"></use>
                </svg>
                <div class="name">购物车</div>
                <div class="code-name">#icon-gouwuche</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kefu"></use>
                </svg>
                <div class="name">客服</div>
                <div class="code-name">#icon-kefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang"></use>
                </svg>
                <div class="name">收 藏 (1)</div>
                <div class="code-name">#icon-shoucang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoucang1"></use>
                </svg>
                <div class="name">收 藏</div>
                <div class="code-name">#icon-shoucang1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fenxiang"></use>
                </svg>
                <div class="name">分 享</div>
                <div class="code-name">#icon-fenxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sx2"></use>
                </svg>
                <div class="name">决策树筛选</div>
                <div class="code-name">#icon-sx2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sx1"></use>
                </svg>
                <div class="name">筛 选</div>
                <div class="code-name">#icon-sx1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-sj-down"></use>
                </svg>
                <div class="name">down</div>
                <div class="code-name">#icon-sj-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-eye1"></use>
                </svg>
                <div class="name">eye</div>
                <div class="code-name">#icon-eye1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dingwei"></use>
                </svg>
                <div class="name">定位</div>
                <div class="code-name">#icon-dingwei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-map"></use>
                </svg>
                <div class="name">map</div>
                <div class="code-name">#icon-map</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-eye"></use>
                </svg>
                <div class="name">eye</div>
                <div class="code-name">#icon-eye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-map1"></use>
                </svg>
                <div class="name">map</div>
                <div class="code-name">#icon-map1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-Icon"></use>
                </svg>
                <div class="name">搜索</div>
                <div class="code-name">#icon-Icon</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-up"></use>
                </svg>
                <div class="name">up</div>
                <div class="code-name">#icon-up</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-left"></use>
                </svg>
                <div class="name">left</div>
                <div class="code-name">#icon-left</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-right"></use>
                </svg>
                <div class="name">left</div>
                <div class="code-name">#icon-right</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-down"></use>
                </svg>
                <div class="name">up</div>
                <div class="code-name">#icon-down</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dui"></use>
                </svg>
                <div class="name">dui-5</div>
                <div class="code-name">#icon-dui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jinggao"></use>
                </svg>
                <div class="name">警告</div>
                <div class="code-name">#icon-jinggao</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
